<!--
  ~ /*
  ~  *    Copyright 2020-2021 luter.me
  ~  *
  ~  *    Licensed under the Apache License, Version 2.0 (the "License");
  ~  *    you may not use this file except in compliance with the License.
  ~  *    You may obtain a copy of the License at
  ~  *
  ~  *      http://www.apache.org/licenses/LICENSE-2.0
  ~  *
  ~  *    Unless required by applicable law or agreed to in writing, software
  ~  *    distributed under the License is distributed on an "AS IS" BASIS,
  ~  *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~  *    See the License for the specific language governing permissions and
  ~  *    limitations under the License.
  ~  */
  -->

<!DOCTYPE html>
<html lang="zh-CN" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorate="~{/pages/tpl/layout.html}">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
</head>
<body>
<section layout:fragment="content">
    <div class="container-fluid">
        <div class="row"><h1>在线用户</h1></div>
        <div class="row">
            <div class="col">
                <table class="table   table-bordered table-striped table-hover">
                    <thead>
                    <tr>
                        <th scope="col">#</th>
                        <th scope="col">ID</th>
                        <th scope="col">签发</th>
                        <th scope="col">过期</th>
                        <th scope="col">appId</th>
                        <th scope="col">userId</th>
                        <th scope="col">用户名</th>
                        <th scope="col">手机</th>
                        <th scope="col">状态</th>
                        <th scope="col">操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="item,status:${tokens}"
                        th:class="${item.id} == ${cToken.id}?'table-info' :''">
                        <th scope="row" th:text="${status.index+1}"></th>
                        <td th:text="${item.id}"></td>
                        <td th:text="${#dates.format(item.iat, 'yyyy-MM-dd HH:mm:ss')}"></td>
                        <td th:text="${#dates.format(item.exp, 'yyyy-MM-dd HH:mm:ss')}"></td>
                        <td th:text="${item.details.appId}"></td>
                        <td th:text="${item.details.userId}"></td>
                        <td th:text="${item.details.attributes.get('username')}"></td>
                        <td th:text="${item.details.attributes.get('mobile')}"></td>
                        <td th:switch="${item.details.attributes.get('enabled')}">
                            <span th:case="true" class="badge bg-success">正常</span>
                            <span th:case="false" class="badge bg-success">锁定</span>
                        </td>
                        <td>
                            <a th:if="${item.details.getPrincipal()}!=${cToken.details.getPrincipal()}"
                               th:href="'/kick/'+${item.id}"
                               class="btn btn-danger btn-sm">踢了</a>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>


</section>


</body>
</html>